<!DOCTYPE HTML>
<html>
    <head>
        <title>nativeDroid - Theme for jQuery Mobile</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		
		<!-- FontAwesome - http://fortawesome.github.io/Font-Awesome/ -->
        <link rel="stylesheet" href="css/font-awesome.min.css" />

		<!-- jQueryMobileCSS - original without styling -->
        <link rel="stylesheet" href="css/jquerymobile.css" />

		<!-- nativeDroid core CSS -->
        <link rel="stylesheet" href="css/jquerymobile.nativedroid.css" />

		<!-- nativeDroid: Light/Dark -->
        <link rel="stylesheet" href="css/jquerymobile.nativedroid.dark.css"  id='jQMnDTheme' />

		<!-- nativeDroid: Color Schemes -->
        <link rel="stylesheet" href="css/jquerymobile.nativedroid.color.green.css" id='jQMnDColor' />

		<!-- jQuery / jQueryMobile Scripts -->
		<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>


    </head>
    <body>
        
    <div data-role="page" data-theme='b'>


        <div data-role="header" data-position="fixed" data-tap-toggle="false" data-theme='b'>
            <a href="index.html" data-ajax="false"><i class='icon-ellipsis-vertical'></i></a>
            <h1>Header &amp; Footer</h1>
        </div>
        
        <div data-role="content">   
	        <div class='inset'>
	        	<h1>Check out the header on top</h1>
	        	<h2>and the footer on the bottom</h2>
				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin porta metus ac nunc placerat congue. Donec non mauris vel nisi tristique iaculis. Nunc dui justo, semper quis tincidunt ut, pellentesque quis dolor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Duis dignissim massa quis orci feugiat imperdiet. Nunc eget suscipit orci. Aenean nec augue rhoncus, porta ligula in, pellentesque risus. Praesent ut enim non lacus posuere varius. Morbi in dapibus ante. Ut ornare convallis urna, et fringilla diam consectetur vitae. Proin iaculis elementum dolor, interdum blandit mauris rhoncus in. In pellentesque mi nibh, sed eleifend ante tincidunt et.</p>
				<p>Nullam eget elit ut quam luctus ultricies ac id dui. Praesent eros velit, egestas a vehicula a, consectetur ut felis. Praesent at risus convallis, sagittis sem et, egestas dui. Quisque ultricies augue libero, vitae pellentesque purus egestas eget. Integer adipiscing nisl in augue faucibus pellentesque. Ut sodales massa ipsum, eget convallis nunc sagittis vitae. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
				<p>Suspendisse ornare ullamcorper massa eget sagittis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer porttitor mauris neque, nec venenatis mi venenatis ut. Vivamus blandit odio tempor blandit aliquam. Sed eu feugiat quam. Ut quis ligula ut sapien pretium vehicula ac vitae nisl. In nec odio mauris. Nulla ultricies libero non sapien ullamcorper, eu lacinia diam vestibulum. Cras tortor metus, blandit eget consequat ut, ullamcorper at neque. Nulla nec velit non purus congue dapibus. Etiam et elementum nulla. In eu odio dui. Sed tristique ligula ipsum, vitae auctor est volutpat eget.</p>
				<p>Proin gravida tristique accumsan. Nunc bibendum elit nunc, nec tempus urna porta id. Mauris aliquam consectetur nisl sed tincidunt. Proin eget erat ligula. Nulla id bibendum elit. Aliquam erat volutpat. Nunc luctus ullamcorper volutpat. Morbi pulvinar eros diam, in pellentesque urna elementum in. Duis cursus lacus felis, in venenatis elit commodo a. Donec eu purus quis ligula imperdiet vehicula quis in massa. Maecenas sed tortor porta augue pellentesque eleifend a sed magna. Mauris et erat vel mi fringilla sodales quis sed dui.</p>
				<p>Donec interdum tortor vitae dolor laoreet semper. Nulla facilisi. Fusce vel diam faucibus, rhoncus risus nec, vulputate nunc. Cras vel dignissim dui. Pellentesque ut malesuada justo, nec congue ligula. Etiam sed felis vel velit accumsan rhoncus. Integer id ante euismod, mattis est id, pellentesque nibh. Pellentesque laoreet turpis aliquam ipsum vulputate pharetra. Nullam vitae tortor non arcu dapibus eleifend. Nullam tempus ligula ut risus egestas, in feugiat leo placerat.</p>
	        </div>
		</div>
		
<!--		<div data-role="footer" class="ui-bar" data-position="fixed" data-tap-toggle="false" data-theme='b'>
            <h1 class="ui-title" role="heading" aria-level="1">Hi I'm a fixed footer.</h1>
		</div> !-->

		<div data-position="fixed" data-tap-toggle="false" data-role="footer" data-tap-toggle="false" data-theme='b'>
			<div data-role="navbar">
				<ul>
					<li><a href="#" data-icon="cogs">config</a></li>
					<li><a href="#" data-icon="map-marker">locate</a></li>
					<li><a href="#" data-icon="share-alt">share it!</a></li>
				</ul>
			</div>
		</div>

    </div>
    
    </body>
</html>
